<template>
  <div ref="code">
    <!-- 商品图 -->
    <div class="banner">
      <van-swipe :autoplay="0">
        <van-swipe-item v-if="showVideo">
          <div class="input_video" v-if="goodsdetail.vedio_url && goodsdetail.vedio_url.length>0">
            <video-player class="video-player vjs-custom-skin" ref="videoPlayer" :playsinline="true"
              :options="playerOptions" @play="onPlayerPlay($event)"></video-player>
          </div>
        </van-swipe-item>
        <van-swipe-item v-for="(image, index) in goodsdetail.goods_images" :key="index">
          <img type="primary" @click="screen" v-lazy="image" />
        </van-swipe-item>
      </van-swipe>
    </div>

    <!-- 视频播放 -->
    <!--全屏-->
    <!-- 内容 -->
    <div class="w w_con">
      <!-- 描述 -->
      <div class="flex-be-center des_box">
        <div class="des_box_text">{{goodsdetail.goods_name}}</div>
        <div class="flex-be-center des_box_icon">
          <div @click="handLike">
            <img :src="like==0?icon.dza:icon.dz" alt />
            <span>{{likeNum2}}</span>
          </div>
          <div>
            <img @click="tcode" :src="icon.fx" alt />
            <span>分享</span>
          </div>
        </div>
      </div>
      <!-- 价格 -->
      <p class="shop_price">
        <span>¥{{total}}</span>
      </p>
      <!-- 运费 -->
      <div class>
        <ul class="flex-be-center freight_box">
          <li>
            运费
            <span>0.00</span>元
          </li>
          <li>
            销量
            <span>3287</span>笔
          </li>
          <li>
            库存
            <span>800</span>
          </li>
        </ul>
      </div>
      <!-- 规格 -->
      <div class="parameters_box" v-if="this.attr_info.length!=0">
        <p @click="active" class="flex-be-center parameters">
          <span>规格</span>
          <img :class="activeimg?'':'rota' " :src="icon.xl" alt />
        </p>
        <div v-show="activeimg " class="parameters_con">
          <div class="parameters_item" v-for="(item,index) in attr_info" :key="index">
            <span class="parameters_item_title itema" style="">{{item.name}}</span>
            <div class="scroll_item" style="overflow-x:scroll;white-space: nowrap;">
              <!-- <div style="overflow-x:scroll;"> -->
              <ul class="parameters_item_con" v-for="(item2,index2) in item.info" :key="index2"
                style="display:inline-block;margin-right: 0.7rem;">
                <!-- <li @click="attr_select(index,index2,item2.id,item2.price,item2)">
                  <em v-show="index2==attr_active[index]">+{{item2.price}}</em>
                  <span
                    :class="index2==attr_active[index]?'actext':'' "
                    
                  >{{item2.attr_name}}</span>
                  <img class="icon_img" type="primary" :src="item2.icon"> 显示规格的图片
                </li> -->
                <li @click="attr_select(index,index2,item2)">
                  <em v-show="item2.isCheck">+{{item2.price}}</em>
                  <span :class="item2.isCheck?'actext':'' "><img class="pic_item" :src="item2.icon" alt=""></span>
                </li>
                <!-- <li>
                  <span :class="attr_active.num1==2?'actext':'' " @click="attr_select(2)">皮革</span>
                </li>-->
              </ul>
              <!-- </div> -->
            </div>
          </div>


        </div>
        <!-- <div class="parameters_item" v-for="(item,index) in goodsdetail.extra_info" :key="index">
            <span class="parameters_item_title">{{item.name}}</span>
            <ul class="parameters_item_con"  v-for="(item2) in item.info">
              <li>
                <em>+{{item2.price}}</em>
                <span class="actext">{{item2.attr_name}}</span>
              </li>
            
            </ul>
          </div>-->

      </div>
      <!-- 评价 -->
      <div>
        <!-- 评价title -->
        <div class="flex-be-center evaluate_box">
          <span>评价</span>
          <div>
            <span>更多评价</span>
            <img :src="icon.more" alt />
          </div>
        </div>
        <!-- 评价内容 -->
        <div class="evaluate_con">
          <p>
            <span class="img_box">
              <img :src="icon.ewm" alt />
            </span>
            <span>Pop_12</span>
          </p>
          <p class="p-two">收到手表了，产品包装很好，手表质量真是不错，产品包装很好，看着很高大上，包装的很精致很严实，表带佩戴的时候很舒适的...</p>
        </div>
      </div>
      <!-- 商品详情 -->
      <div>
        <p>商品详情</p>
        <div v-html="goodsdetail.content">
          <!-- <img src="" alt=""> -->
        </div>
      </div>

      <!-- 加入购物车 -->
      <div class="footer_nav">
        <van-goods-action>
          <van-goods-action-icon :icon="this.coll==1? icon.sc :icon.nosc " text="收藏" @click="onClickIcon" />
          <van-goods-action-icon @click="toCart" :icon="icon.gwc" text="购物车" />
          <van-goods-action-icon :icon="icon.ewm" text="二维码" @click="tcode" />

          <van-button color="#000000" weight round type="warning" text="加入购物车" @click="goCart">加入购物车</van-button>
          <van-button type="danger" round color="#D81E06" text="立即购买" @click="goPayment">立即购买</van-button>
        </van-goods-action>
      </div>
    </div>
    <!-- 上拉 -->
    <div class="b_back" v-show="b_dropup" @click="b_dropup=false"></div>
    <transition name="aaa" mode="">
        <div class="b_dropup" v-if="b_dropup">
          <div class="box_bottom">
            <div class="close_icon" @click="b_dropup=false">
              <van-icon name="cross" />

            </div>
            <img style="max-width: 100%;" :src="imgposter" alt="">
          </div>
          
        </div>
    </transition>
    <!--     <div >
      
    </div> -->
    <!----遮罩层-->
    <div class="mask" v-if="showMask"></div>
    <div class="mask_model" v-if="showMask">
      <img :src="skuImg" alt="" class="sku_img">
      <img src="../../assets/cancle.png" alt="" class="icon_cancle" @click="showMask=false">
      <!-- <p class="absolute">选择规格</p> -->
    </div>
  </div>
</template>
<style lang="" scoped>
  .mask {
    position: fixed;
    bottom: 0;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100vh;
    z-index: 10;
    background: rgba(0, 0, 0, 0.7);
  }

  .mask_model {
    position: fixed;
    z-index: 20;
    width: 6rem;
    height: 6rem;
    top: 50%;
    left: 50%;
    background: #1a1a1a;
    border-radius: 0.1rem;
    display: flex;
    justify-content: center;
    align-items: center;
    transform: translate(-50%, -50%);
  }

  .sku_img {
    width: 80%;
    height: 80%;
  }

  .icon_cancle {
    width: 0.5rem;
    height: 0.5rem;
    position: absolute;
    right: -0.1rem;
    top: -0.1rem;
  }

  .van-swipe-item {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 7.08rem;
  }

  .input_video {
    width: 100%;
    /* height: 20%; */
  }

  .banner {
    width: 100%;
    overflow: hidden;
  }

  .banner_title {}

  .icon_img {
    width: 1rem;
    height: 1rem;
    margin-top: 0.1rem;
  }

  .w {
    overflow: hidden;
  }

  .w_con {
    margin-bottom: 0.98rem;
  }

  .banner img {
    width: 100%;
  }

  /* 商品描述 */
  .des_box {
    margin-top: 0.39rem;
    font-size: 0.26rem;
    font-weight: bold;
    color: rgba(0, 0, 0, 1);
    margin-bottom: 0.43rem;
  }

  .des_box_text {
    width: 4.93rem;
    line-height: 0.36rem;
  }

  .des_box_icon>div {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }

  .des_box_icon>div img {
    width: 0.5rem;
  }

  .des_box_icon>div span {
    font-size: 0.2rem;
    transform: scale(0.7);
    font-weight: 400;
    color: rgba(0, 0, 0, 1);
  }

  .des_box_icon div:nth-child(2) {
    margin-left: 0.2rem;
  }

  .des_box_icon div:nth-child(1) {
    margin-right: 0.2rem;
  }

  /* 价格 */
  .shop_price {
    font-size: 0.26rem;
    font-weight: 400;
    color: rgba(216, 30, 6, 1);
    margin-bottom: 0.31rem;
    padding-left: 0.27rem;
    overflow: hidden;
  }

  /* 运费 销量 */
  .freight_box {
    width: 100%;
    padding-left: 0.27rem;
    margin-bottom: 0.61rem;
    justify-content: start;
  }

  .freight_box li {
    list-style: disc;
    font-size: 0.24rem;
    font-weight: 400;
    color: rgba(153, 153, 153, 1);
    margin-right: 0.99rem;
  }

  /* 规格 */
  .parameters img {
    width: 0.17rem;
  }

  .parameters .rota {
    transform: rotate(180deg);
    -webkit-animation: spin 2s linear infinite;
    animation: spin 2s linear infinite;
  }

  .parameters_box {
    /* margin-bottom: 0.78rem; */
    transition: all 0.5s;
  }

  .parameters_con {
    padding-top: 0.57rem;
    /* padding-bottom: 0.78rem; */
  }

  /* 规格选择 */
  .parameters_item {
    margin-bottom: 0.55rem;

    display: flex;
  }

  .parameters_item_title {
    font-size: 0.24rem;
    font-weight: 400;
    color: rgba(153, 153, 153, 1);
    margin-right: 0.79rem;
    margin-top: 0.08rem;
  }

  .parameters_item_con {
    display: flex;
    flex: 1;
    flex-wrap: wrap;
    margin-top: -0.34rem;
  }

  .parameters_item_con li {
    width: 25%;
    padding-top: 0.34rem;
    padding-bottom: 0.34rem;
    position: relative;
  }

  .parameters_item_con li em {
    position: absolute;
    top: -0.1rem;
    left: 0rem;
    font-size: 0.2rem;
    font-weight: 400;
    color: rgba(216, 30, 6, 1);
    -webkit-transform: scale(0.7);
    transform: scale(0.9);
  }

  .parameters_item_con li span {
    display: inline-block;
    width: 0.98rem;
    height: 0.44rem;
    padding: 0.06rem 0.02rem 0.56rem 0.1rem;
    text-align: center;
    line-height: 0.44rem;
    color: rgba(0, 0, 0, 1);
    font-size: 0.24rem;
  }

  .parameters_item_con li .actext {
    color: rgba(255, 255, 255, 1);
    background: rgba(0, 0, 0, 1);
  }

  /* 评价 */
  .evaluate_box {
    margin-bottom: 0.38rem;
  }

  .evaluate_box>span {
    font-size: 0.26rem;
    color: rgba(153, 153, 153, 1);
  }

  .evaluate_box>div {
    font-size: 0.26rem;
    font-weight: 400;
    color: rgba(0, 0, 0, 1);
  }

  .evaluate_box>div img {
    width: 0.12rem;
  }

  /* 评价 */
  .evaluate_con {
    margin-bottom: 0.62rem;
  }

  .evaluate_con p:nth-child(1) {
    display: flex;
    align-items: center;
    margin-bottom: 0.24rem;
    font-size: 0.26rem;
    font-weight: 400;
    color: rgba(102, 102, 102, 1);
  }

  .evaluate_con p:nth-child(1) .img_box {
    display: inline-block;
    width: 0.58rem;
    height: 0.58rem;
    border-radius: 50%;
    overflow: hidden;
    margin-right: 0.15rem;
  }

  .evaluate_con .p-two {
    font-size: 0.24rem;
    font-weight: 400;
    color: rgba(153, 153, 153, 1);
    line-height: 0.34rem;
  }

  /* 底部导航 */
  .footer_nav button {
    width: 2rem;
    margin: 0 0.15rem 0;
    font-size: 0.24rem;
  }

  .pic_item {
    width: 40px;
  }

  .itema {
    width: 1.5rem;
    text-align: center;
    line-height: 1rem;
  }

  .aaa-enter-active,
  .aaa-leave-active {
    transition: all .5s;
  }


  .aaa-enter,
  .aaa-leave-to {
     transform: translate(0, 100%);
  }

  .b_dropup {
    position: fixed;
    width: 100%;
    height: 85%;
    bottom: 0;
    background-color: white;
    overflow: hidden;
    padding: 0.5rem;
    padding-top: 0.8rem;
    box-sizing: border-box;
    border-radius: 0.3rem 0.3rem 0 0;
  }


  .b_back {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: #333;
    opacity: 0.7;
  }
  .close_icon{
    text-align: center;
    position: absolute;
    right: 0.5rem;
    top: 0.3rem;
  }
  .absolute{
    position: absolute;
    top: 4rem;
    left: 50%;
    width: 3rem;
    text-align: center;
    margin-left: -1.5rem;
    line-height: 1rem;
    color: white;
  }
</style>
<script>
  // import { GoodsAction, GoodsActionIcon, GoodsActionButton } from 'vant'
  import { Toast } from "vant";
  import getData from "../../assets/js/axios";
  import store from "@/store";
  import twocode from "@/components/details/twocode";

  export default {
    name: "index",
    data() {
      empty: false
      return {
        imgposter:"",

        likeNum: '',//点赞数
        showMask: false,
        skuImg: '',//显示规格大图片
        showVideo: false,
        fullscreen: false,
        attr_active: [], //选中下标
        attr_activeid: [], //属性id
        vedio_url: "",
        activeimg: true,
        attr_flag: true, //是否显示规格
        icon: "",
        goodsdes: "",
        images: [
          // 'https://img.yzcdn.cn/vant/apple-1.jpg',
          // 'https://img.yzcdn.cn/vant/apple-2.jpg',
        ],
        icon: {
          dz: require("../../assets/img/goods/dz.png"),
          dza: require("../../assets/img/goods/dza.png"),
          fx: require("../../assets/img/goods/fx.png"),
          xl: require("../../assets/img/goods/zk.png"),
          add: require("../../assets/img/goods/add.png"),
          more: require("../../assets/img/goods/more.png"),
          sc: require("../../assets/img/goods/scac.png"),
          //scac:require("../../assets/img/goods/scac.png"),
          nosc: require("../../assets/img/goods/sc.png"),
          gwc: require("../../assets/img/goods/gwc.png"),
          ewm: require("../../assets/img/goods/ewm.png")
        },
        goodsdetail: "",
        attr_info: "", //全部规格
        goodsid: "", //商品id
        coll: "", //收藏
        like: "",
        playerOptions: {
          playbackRates: [0.5, 1.0, 1.5, 2.0], //可选择的播放速度
          autoplay: false, //如果true,浏览器准备好时开始回放。
          muted: false, // 默认情况下将会消除任何音频。
          loop: false, // 视频一结束就重新开始。
          preload: "auto", // 建议浏览器在<video>加载元素后是否应该开始下载视频数据。auto浏览器选择最佳行为,立即开始加载视频（如果浏览器支持）
          language: "zh-CN",
          aspectRatio: "1:1", // 将播放器置于流畅模式，并在计算播放器的动态大小时使用该值。值应该代表一个比例 - 用冒号分隔的两个数字（例如"16:9"或"4:3"）
          fluid: true, // 当true时，Video.js player将拥有流体大小。换句话说，它将按比例缩放以适应其容器。
          // sources: [
          //   {
          //     type: "",
          //     src : "" //url地址
          //   }
          // ], //sources: [],
          sources: [],
          poster: "", //你的封面地址
          // width: document.documentElement.clientWidth,
          notSupportedMessage: "此视频暂无法播放，请稍后再试", //允许覆盖Video.js无法播放媒体源时显示的默认信息。
          controlBar: {
            timeDivider: true, //当前时间和持续时间的分隔符
            durationDisplay: true, //显示持续时间
            remainingTimeDisplay: false, //是否显示剩余时间功能
            fullscreenToggle: true //全屏按钮
          }
        },
        b_dropup: false
      };
    },
    computed: {
/*       tt(){
        return this.imgposter
      }, */
      total() {
        let spec_price = 0;
        let goods_price = this.goodsdetail.goods_price
        let attr_arr = []
        if (this.attr_info) {
          this.attr_info.map(item => {
            item.info.map(item2 => {
              if (item2.isCheck) {
                spec_price += Number(item2.price)
              }
            })
          })
        }

        return Number(spec_price) + Number(goods_price);
      },
      likeNum2() {
        // this.likeNum=12345;
        return this.likeNum > 10000 ? (Math.floor(this.likeNum / 1000) / 10 + "万") : this.likeNum;
      }
    },
    methods: {
      pic(){
        getData.get_goods_poster({
          gid:this.$route.query.id,
          uid:localStorage.getItem("uid")
        }).then(res=>{
           this.imgposter=res.data.data.poster;
        })
      },
      full(element) {
        //做兼容处理
        if (element.requestFullscreen) {
          element.requestFullscreen();
        } else if (element.mozRequestFullScreen) {
          element.mozRequestFullScreen();
        } else if (element.msRequestFullscreen) {
          element.msRequestFullscreen();
        } else if (element.oRequestFullscreen) {
          element.oRequestFullscreen();
        } else if (element.webkitRequestFullscreen) {
          element.webkitRequestFullScreen();
        } else {
          var docHtml = document.documentElement;
          var docBody = document.body;
          var videobox = document.getElementsByClassName("video-player");
          var cssText = "width:100%;height:100%;overflow:hidden;";
          docHtml.style.cssText = cssText;
          docBody.style.cssText = cssText;
          videobox.style.cssText = cssText + ";" + "margin:0px;padding:0px;";
          document.IsFullScreen = true;
        }
      },
      onPlayerPlay(player) {
        // console.log(player,"9999999")
        player.isReady_ = false
        this.$router.push("/screen?id=" + this.goods_id);
      },
      //图片全屏
      screen() {
        if (!store.state.token) {
          //console.log("在这")
          return this.$router.push("/login");
        } else {
          this.$router.push("/screen?id=" + this.goods_id);
        }


      },
      //点赞
      handLike() {
        //Toast('点击收藏');
        if (!store.state.token) {
          //console.log("在这")
          return this.$router.push("/login");
        }
        //console.log("xiangxial哈哈");
        var para = {
          gid: this.goods_id,
          uid: localStorage.getItem("uid")
        };
        console.log(`${this.goods_id}`)
        getData
          .goodLike(para)
          .then(req => {
            console.log(req, "9999");
            if (req.data.code == 0) {
              if (this.like == 1) {
                Toast("点赞成功");
                this.like = 0;
                this.likeNum++;
              } else {
                Toast("取消点赞");
                this.like = 1;
                this.likeNum--;
              }
            }
          })
          .catch(err => { });
      },
      //收藏
      onClickIcon() {
        //Toast('点击收藏');
        if (!store.state.token) {
          //console.log("在这")
          return this.$router.push("/login");
        }
        //console.log("xiangxial哈哈");
        var para = {
          goods_id: this.goods_id
        };
        getData
          .goodCol(para)
          .then(req => {
            console.log(req, "收藏数据");
            if (req.data.data == 1) {
              this.coll = 1;
              Toast("收藏成功");
            } else {
              this.coll = 0;
              Toast("取消收藏");
            }
          })
          .catch(err => { });
      },

      //二维码,分享
      tcode() {
        if (!store.state.token) {
          return this.$router.push("/login");
        } else {
          this.b_dropup=true;
        }
      },
      //去购物车
      toCart() {
        if (!store.state.token) {
          //console.log("在这")
          return this.$router.push("/login");
        } else {
          this.$router.push("/cart");
        }
      },
      //验证加入购物车 购买的时候是否选择了规格
      getAttr() {
        let attr_arr = []
        this.attr_info.map(item => {
          item.info.map(item2 => {
            if (item2.isCheck) {
              attr_arr.push(item2.id)
            }
          })
        })
        attr_arr = attr_arr.join(',')
        return attr_arr;
      },
      //加入购物车
      async goCart() {
        const arr_id = await this.getAttr()
        var para = {
          goods_id: this.goods_id,
          goods_num: 1,
          attr_ids: arr_id
        };
        getData
          .scarTadd(para)
          .then(req => {
            Toast(req.data.msg);
          })
          .catch(err => { });

      },
      //立即购买
      async goPayment() {

        if (!store.state.token) {
          //console.log("在这")
          return this.$router.push("/login");
        } else {
          const arr_id = await this.getAttr()

          var para = {
            goods_id: this.goods_id,
            goods_num: 1,
            attr_ids: arr_id
          };
          //存储商品信息,传参立即购买,购买之后必须删除
          sessionStorage.setItem("immediatelyPara", JSON.stringify(para)); //存储地址信息
          this.$router.push("/suborder?settle_type=" + 1);
        }
        //Toast('去支付');
      },
      // goCart() {
      //   //Toast('点击按钮');
      //   if (this.attr_active.length != this.attr_info.length) {
      //     //console.log(this.attr_active[0],333)
      //     return Toast("请选择规格22");
      //   } else {
      //     // var attrs=[];
      //     // //for(var i=0;this.attr_info.length;i++){
      //     // //  attrs.push(this.attr_info[i].info[this.attr_active[i]].attr_id)
      //     // //};
      //     // console.log(this.attr_info[1].info[this.attr_active[0]].attr_id)
      //     console.log(this.attr_activeid, "属性id");
      //     var para = {
      //       goods_id: this.goods_id,
      //       goods_num: 1,
      //       attr_ids: this.attr_activeid.toString()
      //     };
      //     getData
      //       .scarTadd(para)
      //       .then(req => {
      //         Toast(req.data.msg + "33");
      //       })
      //       .catch(err => {});
      //   }

      //   // if (store.state.token) {
      //   //   getData.scarTadd(para).then(req=>{
      //   //   //console.log(req,'存入数据')
      //   //   if(req.data.code==2000){
      //   //     //Toast("还未登录");
      //   //     Toast(req.data.msg);
      //   //   }
      //   // }).catch(err=>{
      //   // })

      //   // }else{
      //   //   this.$router.push("/login")
      //   // };
      // },
      //去支付
      // goPayment() {
      //   if (!store.state.token) {
      //     //console.log("在这")
      //     return this.$router.push("/login");
      //   } else {
      //     if (this.attr_active.length != this.attr_info.length) {
      //       //console.log(this.attr_active[0],333)
      //       return Toast("请选择规格22");
      //     }

      //     var para = {
      //       goods_id: this.goods_id,
      //       goods_num: 1,
      //       attr_ids: this.attr_activeid.toString()
      //     };
      //     //存储商品信息,传参立即购买,购买之后必须删除
      //     sessionStorage.setItem("immediatelyPara", JSON.stringify(para)); //存储地址信息
      //     this.$router.push("/suborder?settle_type=" + 1);
      //   }
      //   //Toast('去支付');
      // },
      //旋转动画
      active() {
        this.activeimg = !this.activeimg;
      },
      //选择属性
      // attr_select(a, b, c,price,item) {
      //   console.log(a, b, c, 3636);
      //   this.attr_active.splice(a, 1, b); //存储下标
      //   this.attr_activeid.splice(a, 1, c); //存储属性id
      // },
      attr_select(index, index2, item) {
        // gid mid ids_name
        for (let i = 0; i < this.attr_info.length; i++) {
          if (i == index) {
            this.attr_info[i].info.map(item2 => {
              // console.log(this.attr_info[i].info,"item")
              if (item2.id == item.id) {
                //如果该属性未选中 弹出图片选择  否则就取消
                if (!item.isCheck) {
                  this.$set(item, 'isCheck', true)
                  this.showMask = true
                } else {
                  this.$set(item, 'isCheck', false)
                }
              } else {
                this.$set(item2, 'isCheck', false)
              }
            })

          }
        }
        this.askForImg()
      },
      //展示规格图片
      askForImg() {

        let attr_arr = []
        this.attr_info.map(item => {

          item.info.map(item2 => {
            if (item2.isCheck) {
              attr_arr.push(item2.attr_id)
            }
          })
        })
        attr_arr = attr_arr.join('-')

        //遍历获取规格集合图片
        let para = {
          gid: this.goods_id,
          mid: this.goodsdetail.goods_model_id,
          ids_name: attr_arr,
        };
        getData
          .askImg(para).then(res => {
            console.log(this.skuImg = res.data.data.img, "res img")
          })
      }
    },
    mounted() {
      this.pic();
      document.addEventListener("touchmove",(e)=>{
        if(this.b_dropup) {
          e.preventDefault();
          e.stopPropagation();
          // console.log("zzzzzzzzzzzzzzz")
        }
      }, { passive: false })
      // console.log(this.$route.query.id,666)
      this.goods_id = this.$route.query.id;


      let para = {
        goods_id: this.goods_id,
        uid: localStorage.getItem("uid")
      };
      //let para="/goods_id/57"
      getData
        .goodsDes(para)
        .then(res => {

          console.log(res.data, "主要数据");
          this.goodsdetail = res.data.data;
          // console.log(this.goodsdetail, "9999999");
          res.data.data.extra_info.map(item => {
            item.info.map(item2 => {
              this.$set(item2, 'isCheck', false)
            })
          })

          this.attr_info = res.data.data.extra_info;
          // console.log(this.attr_info,"llllllllllllllllll")
          this.goodsdes = res.data.data.content;
          this.coll = this.goodsdetail.is_collected;
          this.like = this.goodsdetail.is_like;
          this.likeNum = this.goodsdetail.like_num;
          if (res.data.data.vedio_url && res.data.data.vedio_url.length) {
            this.showVideo = true
          } else {
            this.showVideo = false
          }
          let videoSource = {};
          videoSource.type = "video/mp4";
          this.playerOptions.poster = res.data.data.goods_images[0]//封面地址
          videoSource.src = res.data.data.vedio_url;
          this.playerOptions.sources[0] = videoSource;

          if (this.attr_info.length == 0) {
            this.attr_flag = false;
          }



          console.log(`${this.is_like}   ${this.goodsdetail.like_num}  ${localStorage.getItem("uid")}`)

        })
        .catch(err => { });
      // this.$post(axios.api.gddetail+'goods_id/'+id).then(data => {
      //   console.log(data,3636);
      //   this.goodsdetail=data.data
      // })
    },
    components: {
      "twocode":twocode
    }
  };
</script>